<template>
	<uv-overlay v-if="pageLoading" :show="pageLoading" :zIndex="99999" :opacity="0.1">
		<view class="warp" v-if="pageLoading">
			<image class="loading-img"  src="@/static/logo.png"></image>
		</view>
	</uv-overlay>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				show:true
			};
		},
		computed: {
			...mapState('common', ['pageLoading'])
		},
		mounted() {
			console.log(this.pageLoading)
		}
	};
</script>

<style lang="scss" scoped>
	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
		opacity: 0.5;
	}

	.loading-img {
		width: 100rpx;
		height: 100rpx;
		border-radius: 60rpx;
		opacity: 1;
		-webkit-transform: rotate(360deg);
		animation: rotation 2s linear infinite;
		-moz-animation: rotation 2s linear infinite;
		-webkit-animation: rotation 2s linear infinite;
		-o-animation: rotation 2s linear infinite;
	}

	@-webkit-keyframes rotation {
		from {
			-webkit-transform: rotate(0deg);
		}

		to {
			-webkit-transform: rotate(360deg);
		}
	}
</style>